package folderLogger.outputFile.formatting;

import java.text.SimpleDateFormat;
import java.util.Date;

import folderLogger.OperationSettings;
import folderLogger.outputFile.FileAttributes;

public class OutputFileHtml extends OutputFileAbstract {

	private final static String FUNCTION_TOGGLE_FOLDER = "toggleNextRow";
	private final static String FUNCTION_TOGGLE_SUB_FOLDERS = "toggleChildren";
	private final static String FILE_PATH_JS = "script.js";
	private final static String FILE_PATH_CSS = "style.css";
	private final static String CLASS_NAME_FILE = "fileName";
	private final static String CLASS_NAME_FOLDER = "folderName";
	private final static String CLASS_NAME_BUTTON1 = "button1";
	private final static String CLASS_NAME_BUTTON2 = "button2";
	private final static String CLASS_NAME_SHRINKABLE = "shrinkable1";
	private final static String TAG_NAME_SHRINKABLE = "shrinkable";

	public OutputFileHtml()	{
		super();
	}
	
	@Override
	public String getHeader(String baseFolder, OperationSettings settings) {
		StringBuilder output = new StringBuilder();
		output.append(printLine("<html>", 1));
		//	Display Hebrew correctly!
		output.append(printLine("<meta http-equiv=\"Content-Type\" content=\"text/html; charset=ISO-8859-8-I\" />", 0));
		/**
		 * Add META comments to store the settings of the conversion?
		 * 
		 * <meta name="conversionDate" content="22/10/2014 18:07">
		 * <meta name="isCopyPictures" content="true">
		 * <meta name="filterType" content="INCLUDE">
		 * <meta name="fileExtensions" content="mp3;wav;ogg;mpc;">
		 */
		output.append(printLine(String.format("<meta name=\"%s\" content=\"%s\">", "ExecutionTime", new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(new Date())), 0));
		output.append(printLine(String.format("<meta name=\"%s\" content=\"%s\">", "RootFolder", settings.getRootFolderPath()), 0));
		output.append(printLine(String.format("<meta name=\"%s\" content=\"%s\">", "OutputFolder", settings.getOutputFolder()), 0));
		output.append(printLine(String.format("<meta name=\"%s\" content=\"%s\">", "OutputFormat", settings.getOutputFileFormat()), 0));
		output.append(printLine(String.format("<meta name=\"%s\" content=\"%s\">", "ImageReferenceType", settings.getCopyImages()), 0));
		output.append(printLine(String.format("<meta name=\"%s\" content=\"%s\">", "FilterType", settings.getFilterSettings().getFilterType()), 0));
		output.append(printLine(String.format("<meta name=\"%s\" content=\"%s\">", "FilterExtensions", convertArrayToString(settings.getFilterSettings().getExtensions(), ';')), 0));
		
		output.append(printLine("<head>", 1));
		output.append(printLine("<title>Folder View</title>", 0));
		output.append(printLine(String.format("<script type=\"text/javascript\" src=\"%s\\%s\"></script>", resourcesFolder, FILE_PATH_JS), 0));
		output.append(printLine(String.format("<link rel=\"stylesheet\" type=\"text/css\" href=\"%s\\%s\" />", resourcesFolder, FILE_PATH_CSS), -1));
//		output.append(setIdentation("<script type=\"text/javascript\">\n"));

//		output.append(setIdentation("</script>\n"));
		
		output.append(printLine("</head>", 0));
		output.append(printLine("<body>", 1));
		output.append(printLine(String.format("<table currentFolder=\"%s\">", baseFolder), 1));
		return output.toString();
	}
	
	private String convertArrayToString(Object[] extensions, char c) {
		StringBuilder output = new StringBuilder();
		for(Object obj : extensions)
		{
			output.append(obj.toString()+';');
		}
		return output.toString();
		
	}

	@Override
	public String getFooter() {
		StringBuilder output = new StringBuilder();
		
		DecreaseFolderDepth();
		output.append(printLine("</table>", -1));
		output.append(printLine("</body>", -1));
		output.append(printLine("</html>", 0));
		return output.toString();
	}

	@Override
	public String getPreFolder(String folderName, FileAttributes attributes) {
		//		<tr onClick="toggleNextRow(this)">
		//			<td colspan="2">
		//				F_NAME <button type="button" onClick="toggleChildren(this);" collapsed="false">-</button>
		//			</td>
		//		</tr>
		//		<tr name="shrinkable">
		//			<td>
		//				<img src="" />
		//			</td>
		//			<td>
		//				<table currentFolder="">
		//	######################
		//				</table>
		//			</td>
		//		</tr>
		StringBuilder output = new StringBuilder();
		output.append(printLine("<tr>", 1));

		output.append(printLine("<td colspan=\"2\">", 1));
		output.append(printLine(String.format("<button type=\"button\" class=\"%s\" onClick=\"%s(this);\" collapsed=\"false\">-</button>",(getFolderDepth() % 2) == 0 ? CLASS_NAME_BUTTON1 : CLASS_NAME_BUTTON2,FUNCTION_TOGGLE_SUB_FOLDERS), 0));
		output.append(printLine(String.format("<span class=\"%s\" onClick=\"%s(this)\">%s</span>", CLASS_NAME_FOLDER, FUNCTION_TOGGLE_FOLDER, folderName), -1));
		output.append(printLine("</td>", -1));

		output.append(printLine("</tr>", 0));
		output.append(printLine(String.format("<tr name=\"%s\" class=\"%s\">", TAG_NAME_SHRINKABLE, CLASS_NAME_SHRINKABLE), 1));

		output.append(printLine("<td>", 0));

		if(attributes.getImageFileName() != "")
		{
			IncreaseFolderDepth();
			output.append(printLine(String.format("<img src=\"%s\" height=\"200\" />", attributes.getImageFileName()), 0));
			DecreaseFolderDepth();
		}
		
		output.append(printLine("</td>", 0));
		output.append(printLine("<td>", 1));
		output.append(printLine(String.format("<table currentFolder=\"%s\">", folderName), 1));
		return output.toString();
	}

	@Override
	public String getPostFolder(String folderName, FileAttributes attributes) {
		//		<tr>
		//			<td colspan="2">
		//			F_NAME
		//			</td>
		//		</tr>
		//		<tr>
		//			<td>
		//				<img src="" />
		//			</td>
		//			<td>
		//				<table currentFolder="">
		//	######################
		//				</table>
		//			</td>
		//		</tr>
		StringBuilder output = new StringBuilder();
		DecreaseFolderDepth();
		output.append(printLine("</table>", -1));
		output.append(printLine("</td>", -1));
		output.append(printLine("</tr>", 0));
		return output.toString();
	}

	@Override
	public String getPreFile(String fileName, FileAttributes attributes) {
		//		<tr>
		//			<td>
		//			FileName
		//	#########################
		//			</td>
		//		</tr>
		return printTabs()+print(String.format("<tr><td><span class=\"%s\">%s",CLASS_NAME_FILE, fileName));
	}

	@Override
	public String getPostFile(String fileName, FileAttributes attributes) {
		//		<tr>
		//			<td>
		//			FileName
		//	#########################
		//			</td>
		//		</tr>
		StringBuilder output = new StringBuilder();
		output.append(print("</span></td></tr>"));
		output.append(printNl());
		return output.toString();
	}

	@Override
	public String[] getPreProcessData() {
		return new String[] { String.format("%s\\%s", resourcesFolder, FILE_PATH_JS), getJavaScript(), String.format("%s\\%s", resourcesFolder, FILE_PATH_CSS), getCss() };
	}
	
	
	 /**
	  *<script type="text/javascript">
		function findNextSiblingRow(node){	do{node = node.nextSibling;}while(node != null && node.tagName != 'TR')return node;}
		function findNextParentRow(node){do{node = node.parentNode;}while(node != null && node.tagName != 'TR')return node;}
		
		function toggleTrCells(tr) {
			var childElm = tr.childNodes;
			
			for(var i=0; i<childElm.length; i++){
				if(childElm[i].tagName != 'TD')
				{
					continue;
				}
				if(childElm[i].style.display=='none') {
					childElm[i].style.display='inline';
				} else {
				childElm[i].style.display='none';
				}
			}
		}
		function changeTrCells(tr, newState) {
			var childElm = tr.childNodes;
			for(var i=0; i<childElm.length; i++)
			{
				if(childElm[i].tagName == 'TD')
				{	childElm[i].style.display=newState; }
				
			}
		}
		function toggleNextRow(node) {	node=findNextParentRow(node);node=findNextSiblingRow(node);if(node == null){return;}toggleTrCells(node);}
		
		function toggleChildren(node) {
			var oldState = node.getAttribute('collapsed');var newState = (oldState == 'true') ? 'false' : 'true';var newDisplayState = (oldState == 'true') ? 'inline' : 'none';var newDisplayIcon = (oldState == 'true') ? '-' : '+';var parentRow = findNextParentRow(node);var nextRow = findNextSiblingRow(parentRow);var childRows = nextRow.getElementsByTagName('TR');
			changeTrCells(nextRow, newDisplayState);for(var i=0; i<childRows.length; i++){if(childRows[i].hasAttribute('name') && childRows[i].getAttribute('name') == 'shrinkable'){changeTrCells(childRows[i], newDisplayState);}}
			var allButtons = nextRow.getElementsByTagName('BUTTON');node.setAttribute('collapsed',newState);node.innerHTML=newDisplayIcon;for(var i=0; i<allButtons.length; i++){if(allButtons[i].hasAttribute('collapsed')){allButtons[i].setAttribute('collapsed',newState);allButtons[i].innerHTML=node.innerHTML=newDisplayIcon;}}
		}
		</script>
		
		*/
	protected String getJavaScript() {
		//		Write js here
		StringBuilder jsOutput = new StringBuilder();
		jsOutput.append(printLine("function findNextSiblingRow(node) {", 1));
		jsOutput.append(printLine("do{node = node.nextSibling;}while(node != null && node.tagName != 'TR')return node;", -1));
		jsOutput.append(printLine("}\n", 0));
		
		jsOutput.append(printLine("function findNextParentRow(node) {", 1));
		jsOutput.append(printLine("do{node = node.parentNode;}while(node != null && node.tagName != 'TR')return node;", -1));
		jsOutput.append(printLine("}", 0));
		jsOutput.append(printLine("function toggleTrCells(tr) {", 1));
		
		jsOutput.append(printLine("var childElm = tr.childNodes;for(var i=0; i<childElm.length; i++){if(childElm[i].tagName != 'TD'){continue;}", 0));
		jsOutput.append(printLine("if(childElm[i].style.display=='none') {	childElm[i].style.display='inline';	} else {childElm[i].style.display='none';}}", -1));
		jsOutput.append(printLine("}", 0));
		
		jsOutput.append(printLine("function changeTrCells(tr, newState) {", 1));
		jsOutput.append(printLine("var childElm = tr.childNodes;for(var i=0; i<childElm.length; i++){if(childElm[i].tagName == 'TD'){	childElm[i].style.display=newState; }}", -1));
		jsOutput.append(printLine("}", 0));
		
		jsOutput.append(printLine(String.format("function %s(node) {",FUNCTION_TOGGLE_FOLDER), 1));
		jsOutput.append(printLine("node=findNextParentRow(node);node=findNextSiblingRow(node);if(node == null){return;}toggleTrCells(node);", -1));
		jsOutput.append(printLine("}\n", 0));
		
		jsOutput.append(printLine(String.format("function %s(node) {",FUNCTION_TOGGLE_SUB_FOLDERS), 1));
		jsOutput.append(printLine("var oldState = node.getAttribute('collapsed');var newState = (oldState == 'true') ? 'false' : 'true';var newDisplayState = (oldState == 'true') ? 'inline' : 'none';var newDisplayIcon = (oldState == 'true') ? '-' : '+';var parentRow = findNextParentRow(node);var nextRow = findNextSiblingRow(parentRow);var childRows = nextRow.getElementsByTagName('TR');", 0));
		jsOutput.append(printLine(String.format("changeTrCells(nextRow, newDisplayState);for(var i=0; i<childRows.length; i++){if(childRows[i].hasAttribute('name') && childRows[i].getAttribute('name') == '%s'){changeTrCells(childRows[i], newDisplayState);}}", TAG_NAME_SHRINKABLE),0));
		jsOutput.append(printLine("var allButtons = nextRow.getElementsByTagName('BUTTON');node.setAttribute('collapsed',newState);node.innerHTML=newDisplayIcon;for(var i=0; i<allButtons.length; i++){if(allButtons[i].hasAttribute('collapsed')){allButtons[i].setAttribute('collapsed',newState);allButtons[i].innerHTML=node.innerHTML=newDisplayIcon;}}", -1));
		jsOutput.append(printLine("}", 0));
		return jsOutput.toString();
	}
	
	/**
	 *
	 *	.button1 {
		   border-top: 1px solid #96d1f8;
		   background: #65a9d7;
		   background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));
		   background: -webkit-linear-gradient(top, #3e779d, #65a9d7);
		   background: -moz-linear-gradient(top, #3e779d, #65a9d7);
		   background: -ms-linear-gradient(top, #3e779d, #65a9d7);
		   background: -o-linear-gradient(top, #3e779d, #65a9d7);
		   padding: 5px 10px;
		   -webkit-border-radius: 8px;
		   -moz-border-radius: 8px;
		   border-radius: 8px;
		   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
		   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
		   box-shadow: rgba(0,0,0,1) 0 1px 0;
		   text-shadow: rgba(0,0,0,.4) 0 1px 0;
		   color: white;
		   font-size: 14px;
		   font-family: Georgia, serif;
		   text-decoration: none;
		   vertical-align: middle;
		   }
		.button1:hover {
		   border-top-color: #28597a;
		   background: #28597a;
		   color: #ccc;
		   }
		.button1:active {
		   border-top-color: #1b435e;
		   background: #1b435e;
		}
		
		.button2 {
		   border-top: 1px solid #ebd773;
		   background: #ffd500;
		   background: -webkit-gradient(linear, left top, left bottom, from(#f09800), to(#ffd500));
		   background: -webkit-linear-gradient(top, #f09800, #ffd500);
		   background: -moz-linear-gradient(top, #f09800, #ffd500);
		   background: -ms-linear-gradient(top, #f09800, #ffd500);
		   background: -o-linear-gradient(top, #f09800, #ffd500);
		   padding: 5px 10px;
		   -webkit-border-radius: 8px;
		   -moz-border-radius: 8px;
		   border-radius: 8px;
		   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
		   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
		   box-shadow: rgba(0,0,0,1) 0 1px 0;
		   text-shadow: rgba(0,0,0,.4) 0 1px 0;
		   color: white;
		   font-size: 14px;
		   font-family: Georgia, serif;
		   text-decoration: none;
		   vertical-align: middle;
		   }
		.button2:hover {
		   border-top-color: #ffa333;
		   background: #ffa333;
		   color: #ccc;
		   }
		.button2:active {
		   border-top-color: #cf8127;
		   background: #cf8127;
		   }
		
	 **/
	protected String getCss()
	{
		//	Write css here
		StringBuilder cssOutput = new StringBuilder();
		//	File - Folder
		cssOutput.append(printLine(String.format(".%s {", CLASS_NAME_FILE), 1));
		cssOutput.append(printLine(String.format("font-family:%s;", "Arial"), -1));
		cssOutput.append(printLine("}", 0));
		cssOutput.append(printLine(String.format(".%s {", CLASS_NAME_FOLDER), 1));
		cssOutput.append(printLine(String.format("color:%s;", "#585858"), 0));
		cssOutput.append(printLine(String.format("font-weight:%s;", "bold"), 0));
		cssOutput.append(printLine(String.format("font-family:%s;", "Arial"),0));
		cssOutput.append(printLine(String.format("font-size:%s;", "20px"), 0));
		cssOutput.append(printLine(String.format("padding:%s;", "5px"), -1));
		cssOutput.append(printLine("}", 0));
		//	Button1
		cssOutput.append(printLine(String.format(".%s {", CLASS_NAME_BUTTON1), 1));
		cssOutput.append(printLine(String.format("border-top: 1px solid #96d1f8;background: #65a9d7;background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));background: -webkit-linear-gradient(top, #3e779d, #65a9d7);background: -moz-linear-gradient(top, #3e779d, #65a9d7);background: -ms-linear-gradient(top, #3e779d, #65a9d7);background: -o-linear-gradient(top, #3e779d, #65a9d7);padding: 5px 10px;-webkit-border-radius: 8px;-moz-border-radius: 8px;border-radius: 8px;-webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;-moz-box-shadow: rgba(0,0,0,1) 0 1px 0;box-shadow: rgba(0,0,0,1) 0 1px 0;text-shadow: rgba(0,0,0,.4) 0 1px 0;color: white;font-size: 14px;font-family: Georgia, serif;text-decoration: none;vertical-align: middle;"), 0));
		cssOutput.append(printLine(String.format("width: 30px;"), -1));
		cssOutput.append(printLine("}", 0));		
		cssOutput.append(printLine(String.format(".%s:hover {", CLASS_NAME_BUTTON1), 1));
		cssOutput.append(printLine("border-top-color: #28597a;background: #28597a;color: #ccc;", -1));
		cssOutput.append(printLine("}", 0));
		cssOutput.append(printLine(String.format(".%s:active {", CLASS_NAME_BUTTON1), 1));
		cssOutput.append(printLine("border-top-color: #1b435e;background: #1b435e;", -1));
		cssOutput.append(printLine("}", 0));
		//	Button2
		cssOutput.append(printLine(String.format(".%s {", CLASS_NAME_BUTTON2), 1));		
		cssOutput.append(printLine(String.format("border-top: 1px solid #ebd773;background: #ffd500;background: -webkit-gradient(linear, left top, left bottom, from(#f09800), to(#ffd500));background: -webkit-linear-gradient(top, #f09800, #ffd500);background: -moz-linear-gradient(top, #f09800, #ffd500);background: -ms-linear-gradient(top, #f09800, #ffd500);background: -o-linear-gradient(top, #f09800, #ffd500);padding: 5px 10px;-webkit-border-radius: 8px;-moz-border-radius: 8px;border-radius: 8px;-webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;-moz-box-shadow: rgba(0,0,0,1) 0 1px 0;box-shadow: rgba(0,0,0,1) 0 1px 0;text-shadow: rgba(0,0,0,.4) 0 1px 0;color: white;font-size: 14px;font-family: Georgia, serif;text-decoration: none;vertical-align: middle;"), 0));
		cssOutput.append(printLine(String.format("width: 30px;"), -1));
		cssOutput.append(printLine("}", 0));
		cssOutput.append(printLine(String.format(".%s:hover {", CLASS_NAME_BUTTON2), 1));
		cssOutput.append(printLine("border-top-color: #ffa333;background: #ffa333;color: #ccc;", -1));
		cssOutput.append(printLine("}", 0));
		cssOutput.append(printLine(String.format(".%s:active {", CLASS_NAME_BUTTON2), 1));
		cssOutput.append(printLine("border-top-color: #cf8127;background: #cf8127;", -1));
		cssOutput.append(printLine("}", 0));	
		return cssOutput.toString();
	}

}
